<template>
 <van-popup
  class="access_itpop"
  v-model="isAccessShow"
  position="bottom"
  closeable
  close-icon-position="top-right"
  overlay
  :style="{height:'83%'}">
  <div class="it_container">
<div class="area">
    <h6>区县</h6>
    <van-button round  size="small">市辖区</van-button>
    <van-button round  size="small">芙蓉区</van-button>
    <van-button  round  size="small">天心区</van-button>
    <van-button round  size="small">岳麓区</van-button>
    <van-button round  size="small">开福区</van-button>
    <van-button  round  size="small">雨花区</van-button>
    <van-button round  size="small">长沙县</van-button>
    <van-button round  size="small">望城县</van-button>

</div>
<div class="area">
    <h6>职业类型</h6>
    <van-button round  size="small">全部职业</van-button>
    <van-button round  size="small">月嫂</van-button>
    <van-button  round  size="small">育婴师</van-button>
    <van-button round  size="small">保洁/清洗</van-button>
    <van-button round  size="small">保姆</van-button>
    <van-button  round  size="small">产康师</van-button>
    <van-button round  size="small">早教/托管</van-button>
    <van-button round  size="small">养老/陪护</van-button>
</div>
<div class="area">
    <h6>信用等级</h6>
    <van-button round  size="small">AAAA级</van-button>
    <van-button round  size="small">AAAAA级</van-button>
</div>
<div class="area">
    <h6>已认证客户服务数</h6>
    <van-button round  size="small">大于100</van-button>
    <van-button round  size="small">50-100</van-button>
    <van-button  round  size="small">30-50</van-button>
    <van-button round  size="small">小于30人</van-button>
</div>
<div class="area">
    <h6>职业类型</h6>
    <van-button round  size="small">500-1000</van-button>
    <van-button round  size="small">1000人以..</van-button>
    <van-button  round  size="small">200人以上</van-button>
    <van-button round  size="small">200-500</van-button>
</div>
<van-row type="flex" justify="space-around" class="btn">
  <van-col span="12">
      <van-button round  size="normal" >清除条件</van-button>
  </van-col>
  <van-col span="12">
      <van-button round  size="normal">确认筛选</van-button>
  </van-col>
</van-row>
  </div>
 </van-popup>

</template>

<script>
export default {
  name: 'ItAccess',
  data () {
    return {
      isAccessShow: false,
    }
  },
  methods: {
    ShowDialog () {
      this.isAccessShow = true
    },
  },
}
</script>

<style lang="scss" scoped>
// .access_itpop{
// }
.it_container{
    .area{
        padding-left: 25px;
        h6{
            font-size: 14px;
            color: #101010;
        }
        .van-button{
         width: 150px;
          height: 50px;
          color: #979191;
           border: 1px solid #979191;
          margin-right: 20px;
        }
    }
    .btn{
        .van-button{
            width:300px;
            height: 70px;
            color: #fff;
            background-color: #3f51b5;
            margin:40px 30px;
        }
    }
}
</style>
